<div class="panel panel-flat">
    <div class="panel-body">
        <input type="hidden" th:value="${student.id}" name="studentId"/>

        <div class="form-group" id="coverImageDiv">
            <label class="control-label col-lg-2">学员封面：</label>
            <div class="col-lg-5">
                <a class="img_icon" href="javascript:;"
                   onclick="showImageSelector(this);" aspect-ratio="1"
                   data-save-func="saveTemplateImage" attr-name="edit_feed_smallImg">
                    <img th:if="${student.imageStore != null}" th:src="@{/showImage(id=${student.imageStore.id})}" alt="" style="max-width: 200px; max-height: 200px;"/>
                    <img th:if="${student.imageStore == null}" th:src="@{/images/upload-select-bg.jpg}" alt="" style="max-width: 200px; max-height: 200px;"/>
                </a>
                <input type="file" onchange="changeImageUrl(this);" name="studentImageFile"
                       style="left:-9999px;position:absolute;"/>

                <input type="hidden" th:if="${student.imageStore != null}" th:value="${student.imageStore.id}" name="studentImageId"/>

            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-lg-2">学员介绍：</label>
            <div class="col-lg-10">
                    <textarea rows="5" cols="5" class="form-control" th:text="${student.introduction}" name="introduction"
                              placeholder="请输入学员介绍"></textarea>
            </div>
        </div>
    </div>
</div>
<script th:inline="javascript">

    $(function () {

        jQuery.validator.addMethod("checkImageFile", function (value, element) {
            var studentImageId = $("input[name=studentImageId]").val();
            /*<![CDATA[*/
            if((studentImageId && studentImageId != '') || value){
                return true;
            }
            /*]]>*/
            return false;
        }, "封面不能为空");

        $("#form-student-submit").validate({
            ignore: 'input[type=hidden]',
            errorClass: 'validation-error-label',
            successClass: 'validation-valid-label',
            highlight: function (element, errorClass) {
                $(element).removeClass(errorClass);
            },
            unhighlight: function (element, errorClass) {
                $(element).removeClass(errorClass);
            },
            // Different components require proper error label placement
            errorPlacement: function (error, element) {
                // Styled checkboxes, radios, bootstrap switch
                if (element.attr("type") == "checkbox") {
                    error.appendTo(element.parent().parent().parent().parent().parent().parent().parent());
                } else if (element.parents('div').hasClass("checker") || element.parents('div').hasClass("choice") || element.parent().hasClass('bootstrap-switch-container')) {
                    if (element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
                        error.appendTo(element.parent().parent().parent().parent());
                    }
                    else {
                        error.appendTo(element.parent().parent().parent().parent().parent());
                    }
                }

                // Unstyled checkboxes, radios
                else if (element.parents('div').hasClass('checkbox') || element.parents('div').hasClass('radio')) {
                    error.appendTo(element.parent().parent().parent());
                }

                // Input with icons and Select2
                else if (element.parents('div').hasClass('has-feedback') || element.hasClass('select2-hidden-accessible')) {
                    error.appendTo(element.parent());
                }

                // Inline checkboxes, radios
                else if (element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
                    error.appendTo(element.parent().parent());
                }

                // Input group, styled file input
                else if (element.parent().hasClass('uploader') || element.parents().hasClass('input-group')) {
                    error.appendTo(element.parent().parent());
                }
                else {
                    //console.log(error);
                    //console.log(element);
                    error.insertAfter(element);
                }
            },
            validClass: "validation-valid-label",
            success: function (label) {
                label.remove();
            },
            rules: {
                introduction: {
                    required: true
                },
                studentImageFile: {
                    checkImageFile: true
                }
            },
            messages: {
                introduction: {
                    required: "学员介绍不能为空"
                }

            },
            submitHandler: function (form) {
                var formData = new FormData($(form)[0]);
                $.ajax({
                    url: '/management_system/saveStudent',
                    type: 'POST',
                    data: formData,
                    dataType: 'JSON',
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        if(data.code == 0){
                            showSuccessMessage("保存成功！");
                            $('#modal-student-edit').modal('hide');
                            loadStudentPage(0);
                        }else{
                            showErrorMessage("保存出错！");
                        }

                    },
                    error: function (error) {
                        console.log(error);
                            showErrorMessage("保存出错！");
                    }
                });

            }
        });

    });


    function showImageSelector() {

        $("input[name=studentImageFile]").trigger("click");

    }

    function changeImageUrl(obj) {
        if ($(obj).val() != "") {
            $("input[name=studentImageId]").val("");
            var url = window.URL.createObjectURL(obj.files[0])
            $("#coverImageDiv").find("img").attr("src", url)
        }
    }
    
    function redirectStudentList() {


    }


</script>